<template>
	<view class="toAnswer">
		<navBar isBack backColor="#333" title="回答" color="#333" background="#fff"></navBar>
		<view class="title">
			<view class="topTxt">
				<span>问</span>
				{{title}}
			</view>
		</view>
		<view class="content">
			<textarea value="" v-model="content" placeholder="写下你的回答吧~" />
			<p>5个字以上</p>
		</view>
		<view class="submitBtn">
			<button type="default" @click="toSubmit">提交</button>
		</view>
	</view>
</template>

<script>
	import service_oneN from '@/service/oneN.js'
	export default{
		data(){
			return{
				question_id:null,
				content:'',
				title:""
			}
		},
		onLoad(options) {
			this.$utils.getUrl()
			console.log(options);
			this.question_id = options.question_id
			this.title = options.title
		},
		methods:{
			// 提交问题
			toSubmit(){
				if(this.content.length<5){
					uni.showToast({
						title:'请输入5个字以上回答！',
						icon:'none'
					})
					return
				}
				let params = {
					question_id:this.question_id,
					content:this.content
				}
				service_oneN.toAnswer(params).then(res=>{
					console.log(res,'回答问题')
					if(res.code==1){
						uni.showToast({
							title:'回答成功',
							icon:'success'
						})
						this.content = ''
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page{height: 100%;}
	.toAnswer{
		height: 100%;
		padding: 0rpx 32rpx;
		background-color: #fff;
		.title{
			padding: 40rpx 0;
			border-bottom: 2rpx solid #F5F5F5;
			.topTxt{
				font: 500 28rpx/32rpx PingFang SC;
				color: #333;
				display: flex;
				span{
					text-align: center;
					margin-right: 12rpx;
					width: 32rpx;
					height: 32rpx;
					border-radius: 4rpx;
					color: #fff;
					font: 500 20rpx/32rpx PingFang SC;
					background-image:linear-gradient(180deg, #FFCC60 0%, #FA8D38 100%) ;
				}
			}
		}
		.content{
			padding: 32rpx 0;
			display: flex;
			border-bottom: 2rpx solid #F5F5F5;
			flex-direction: column;
			textarea{
				width: 100%;
				height: 174rpx;
			}
			p{margin-left: auto;font: 400 24rpx/36rpx PingFang SC;color: #939393;}
		}
		.submitBtn{
			width: 100%;
			height: 108rpx;
			background-color: #fff;
			position: fixed;
			left: 0;
			bottom: 0;
			height: calc(108rpx+ constant(safe-area-inset-bottom));///兼容 IOS<11.2/
			height: calc(108rpx + env(safe-area-inset-bottom));///兼容 IOS>11.2/
			padding-bottom: constant(safe-area-inset-bottom);///兼容 IOS<11.2/
			padding-bottom: env(safe-area-inset-bottom);///兼容 IOS>11.2/
			button{
				margin: 10rpx auto;
				width: 520rpx;
				height: 88rpx;
				background-color: #C3AB7C;
				border-radius: 44rpx;
				color: #fff;
				font: 600 32rpx/88rpx PingFang SC;
			}
		}
	}
</style>
